<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="leanote,leanote.com">
<meta name="description" content="leanote, Not Just A Notepad!">
<meta name="author" content="leanote">
<title class="lang">Leanote login</title>
<link href="public/css-libs/bootstrap.css" rel="stylesheet">
<link href="public/css-libs/font-awesome-4.2.0/css/font-awesome.css" rel="stylesheet">
<link href="public/css/login.css" rel="stylesheet">
<script>
// for windows
if(process.platform != 'darwin') {
	document.write('<link rel="stylesheet" href="public/css/windows.css" type="text/css" />');
}
</script>
</head>
<body id="boxBody">
	<div id="container">

	<!-- 关闭, 最小化, 最大 -->
	<div id="winTool" class="win-tool clearfix">
		<a class="tool-close-blur"></a>
	</div>

	<div class="bottom">
		<a id="localAccount" onclick="openExternal('https://leanote.com/register')"  class="lang localAccount">Sign up Leanote</a>

		<a id="customServer" class="lang customServer">Sign in to Self-hosted Service</a>

		<!-- <a id="localAccount" class="lang localAccount">Create Local Account</a> -->

		<a id="loginWithLeanote" class="lang loginWithLeanote">Sign in to Leanote</a>
	</div>

	<section id="box">
		<div class="drag"></div>
		<div>
			<div class="faq" onclick="openExternal('https://github.com/leanote/desktop-app/issues/225')"><i class="fa fa-question-circle"></i></div>
			<h1 id="logo">
				<a onclick="openExternal('https://leanote.com')" id="loadingLogo" title="leanote">
					<span class="logo"></span>
				</a>
				<span class="lang customServer">Self-hosted Service</span>
			</h1>

			<div class="alert-wrap">
				<!-- 信息  -->
				<div class="alert alert-danger" id="loginMsg"></div>
			</div>

			<!-- 创建本地用户 -->
			<div class="boxForm local-form">
				<form>
					<div class="formContainer">
						<div class="form-group form-group-1">
							<input type="text" required placeholder="Username" class="form-control lang-placeholder" id="username" name="username" value="">
						</div>
						<div class="form-group form-group-1">
							<input type="password" required placeholder="Password" class="form-control lang-placeholder" id="pwd1" name="pwd1">
						</div>
						<div class="form-group pwd-group">
							<input type="password" required placeholder="Confirm password" class="form-control lang-placeholder" id="pwd2" name="pwd2">
							<button id="regBtn" class="btn-embeded" disabled>
								<i class="btn-go fa fa-arrow-right"></i>
								<i class="btn-loading"><img src="public/images/loading-24.gif"/></i>
						</button>
						</div>
					</div>
				</form>
			</div>

			<!-- 普通用户 -->
			<div class="boxForm leanote-form">
				<form>
					<div class="formContainer">
						<div class="form-group form-group-1 host-group" id="hostGroup">
						    <input type="text" placeholder="Host, https://leanote.com" class="form-control lang-placeholder" id="host" name="host">
						</div>

						<div class="form-group form-group-1">
							<input type="text" placeholder="Username or Email" class="form-control lang-placeholder" id="email" name="email" value="">
						</div>
						<div class="form-group pwd-group">
						    <input type="password" placeholder="Password" class="form-control lang-placeholder" id="pwd" name="pwd">
						    <button id="loginBtn" class="btn-embeded" disabled>
						    	<i class="btn-go fa fa-arrow-right"></i>
						    	<i class="btn-loading"><img src="public/images/loading-24.gif"/></i>
						</button>
						</div>
					</div>

					<div class="clearfix btns">
						<a onclick="openExternal('https://leanote.com/findPassword')" class="pull-right m-t-xs"><small class="lang">Forget password?</small></a>
						<!--
						<a onclick="openExternal('https://leanote.com/register')" class="pull-right m-t-xs" style="margin-right: 10px"><small class="lang">Sign up</small></a>
						-->
					</div>
				</form>
			</div>
	    </div>
	</section>

</div>

<script src="public/js/jquery-1.9.0.min.js"></script>
<script src="public/js/bootstrap.js"></script>

<script src="public/config.js"></script>
<script src="src/browser/service_login.js"></script>
<script src="public/js/lang.js"></script>
<script>
function getMsg(key) {
	return langData[key] || key;
}
</script>
<script src="public/js/common.js"></script>

<script>
$(function() {
    // 不要显示顶部菜单
    gui.Menu.setApplicationMenu(null)

	$('.tool-close-blur').click(function() {
		gui.getCurrentWindow().close();
	});

	var $hostGroup = $('#hostGroup');
	var $pwdTestGroup = $('#pwdTestGroup');
	var hasHost = false;

	function isValidUrl(url) {
		return /http(s*):\/\/.+/.test(url);
	}

	$("#email").focus();

	if($("#email").val()) {
		$("#pwd").focus();
	}
	function showMsg(msg, id) {
		$("#loginMsg").html(msg).show();
		if(id) {
			$("#" + id).focus();
		}
	}
	function hideMsg() {
		$("#loginMsg").hide();
	}

	var $email = $("#email");
	var $host = $('#host');

	var $body = $('body');


	$("#loginBtn").click(function(e) {
		e.preventDefault();
		var email = $email.val();
		var pwd = $("#pwd").val();
		var host = $host.val();

		if(!email) {
			showMsg(getMsg("Email is required"), "email");
			return;
		}
		if(!pwd) {
			showMsg(getMsg("Password is required"), "pwd");
			return;
		} else {
			if(pwd.length < 6) {
				showMsg(getMsg("Email or Password Error"), "pwd");
				return;
			}
		}
		if(hasHost && (!host || !isValidUrl(host))) {
			showMsg(getMsg('Invalid host'), 'host');
			return;
		}
		$body.addClass('loading');
		hideMsg();
		// TODO show loading
		// console.log(33);
		// $("#loginBtn").html("loading...").addClass("disabled");
		if(!hasHost) {
			host = '';
		}
		UserService.login(email, pwd, host, function(ret) {
			if (ret) {
				// setTimeout(function() {
				$body.removeClass('loading');
				goToMainPage();
				// gui.getCurrenstWindow().close();
				// }, 2000);
			}
			// 不成功, 则用api登录
			else {
				$body.removeClass('loading');
				showMsg(getMsg("Email or Password Error"));
			}
		})
	});

	// 创建本地账户
	$("#regBtn").click(function(e) {
		e.preventDefault();
		var username = $("#username").val();
		var pwd1 = $("#pwd1").val();
		var pwd2 = $('#pwd2').val();

		if(!username) {
			showMsg(getMsg("Username is required"), "username");
			return;
		}
		if(!pwd1 || !pwd2) {
			showMsg(getMsg("Password is required"), "pwd1");
			return;
		} else {
			if(pwd1.length < 6 || pwd2.length < 6) {
				showMsg(getMsg("The minimum password length is 6"), "pwd1");
				return;
			}
		}
		$body.addClass('loading');
		hideMsg();
		UserService.createLocalUser(username, pwd1, function(ret, dbuser) {
			if(ret) {
				setTimeout(function(){
					$body.removeClass('loading');
					goToMainPage();
					// gui.getCurrentWindow().close();
				}, 2000);
			} else {
				$body.removeClass('loading');
				showMsg(getMsg(dbuser));
			}
		});
	});

	var $loginBtnO = $("#loginBtn");
	var $regBtnO = $('#regBtn');
	function checkDisabled() {
		var email = $("#email").val();
		var pwd = $("#pwd").val();
		if(!email || !pwd) {
			$loginBtnO.attr('disabled', true);
		} else {
			$loginBtnO.attr('disabled', false);
		}

		// reg
		var username = $("#username").val();
		var pwd1 = $("#pwd1").val();
		var pwd2 = $('#pwd2').val();
		if (username && pwd1 && pwd2) {
			$regBtnO.attr('disabled', false);
		} else {
			$regBtnO.attr('disabled', true);
		}
	}

	$('body, input').on('keydown', function() {
		setTimeout(function() {
			checkDisabled();
		});
	});
	$('body').on('click', function() {
		setTimeout(function() {
			checkDisabled();
		});
	});
	$('#customServer').click(function() {
		$body.addClass('custom-server');
		$host.focus();
		hasHost = true;
		hideMsg();
	});

	/*
	$('#localAccount').click(function() {
		$body.addClass('local-account');
		$('#username').focus();
		hideMsg();
	});
	*/

	$('#loginWithLeanote').click(function () {
		$body.removeClass('local-account custom-server');
		hasHost = false;
		$email.focus();
		hideMsg();
	});
});

// win.resizeTo(268, 356);
// win.setPosition('center');

</script>


</body>

</html>
